<template>
    <el-tabs v-model="current" v-if="loaded">
        <el-tab-pane :disabled="!isNew" label="基本信息" name="basic">
            <z-form :url="basicUrl" :closable="false" :data="invoiceData" :fields="basicFields">
            </z-form>
        </el-tab-pane>
        <el-tab-pane :disabled="isNew" label="发票明细" lazy name="detail">
            <z-table title="发票明细" url="/do/join/material_invoice" :params="invoiceParams" :columns="materialColumns"
                     :size="5">
                <template #header$="">
                    <z-action label='添加物料' mode='dialog' :fields="materialFields" type='primary'
                              url='/do/put/invo_materia'/>
                </template>
                <template #action$="{ row }">
                    <z-action label='删除' mode='confirm' link :data="row" url='/do/delete/invo_materia'/>
                </template>
            </z-table>
        </el-tab-pane>
        <el-tab-pane :disabled="isNew" label="开票信息" lazy name="invoice">
            <z-form url="/do/patch/invoice" :closable="false" :data="inv" :fields="invoiceFields"
                    :beforeSubmit="beforeSubmitInvoice">
            </z-form>
        </el-tab-pane>
        <el-tab-pane :disabled="isNew" label="邮寄信息" lazy name="mail">
            <z-form url="/do/patch/invoice" :closable="false" :data="mai" :fields="mailFields"
                    :beforeSubmit="beforeSubmitMail"/>
        </el-tab-pane>
    </el-tabs>
</template>


<script>
import configs from "./.lowcode/configs";

export default {
    name: "p-j4k5c6p",
    provide: {configs},

    props: {
        params: Object,
    },
    computed: {
        basicUrl() {
            return this.isNew ? "/api/invoice/addInvoice" : "/do/patch/invoice";
        },
        inv() {
            const {invoiceData} = this;
            if (!invoiceData || !invoiceData.invoice) {
                return {};
            }
            const result = {};
            for (const [key, value] of Object.entries(invoiceData.invoice)) {
                if (value != {}) {
                    result[key] = value.value;
                }
            }
            return result;
        },
        mai() {
            const {invoiceData} = this;
            if (!invoiceData || !invoiceData.mail) {
                return {};
            }
            const result = {};
            for (const [key, value] of Object.entries(invoiceData.mail)) {
                if (value != {}) {
                    result[key] = value.value;
                }
            }
            return result;
        },
    },
    data() {
        return {
            current: "basic",
            basicFields: [
                {
                    name: "type",
                    default: 1,
                    visible: false
                },
                {
                    name: "related",
                    type: "search",
                    params: {
                        inorout: 2,
                        status: 8
                    },
                    tenant: true
                },
                "performParty",
                {
                    name: "invoiceType",
                    default: 1
                },
                "number",
                "code",
                "amount",
                {
                    name: "rate",
                    append: "%"
                },
                "tax",
                "date",
            ],
            materialColumns: [
                {label: "物料名称", name: "title"},
                {label: "内部编码", name: "internalCode"},
                {label: "外部编码", name: "externalCode"},
                {label: "规格型号", name: "sku"},
                {label: "计量单位", name: "unit", code: "cfg_cfgMaterialUnit"},
                {label: "不含税金额", name: "taxExcluded", type: "money"},
                {label: "税率", name: "rate", code: "cfg_cfgRate"},
                {label: "含税金额", name: "gstInclusive", type: "money"},
                {label: "物料说明", name: "explain"},
                {label:"数量",name:"numLeft"}
            ],
            materialFields: [],
            invoiceParams: null,
            invoiceFields: [
                {
                    label: "发票抬头",
                    name: "title",
                },
                {
                    label: "纳税人识别号",
                    name: "taxpayerIdNumber",
                },
                {
                    label: "开户银行",
                    name: "bankName",
                },
                {
                    label: "银行账号",
                    name: "bankAccountNo",
                },
                {
                    label: "地址",
                    name: "address",
                    type: "address"
                },
                {
                    label: "详细地址",
                    name: "detailAddress",
                },
                {
                    label: "电话",
                    name: "phone",
                }
            ],
            mailFields: [
                {
                    label: "收件人",
                    name: "receiver",
                },
                {
                    label: "收件电话",
                    name: "receiverPhone",
                },
                {
                    label: "邮寄地址",
                    name: "receiverAddress",
                    type: "address"
                },
                {
                    label: "详细地址",
                    name: "receiverDetailAddress",
                },
                {
                    label: "邮箱",
                    name: "receiverEmail",
                }
            ],
            loaded: false,
            isNew: true,
            invoiceData: {},
            invoice: {},
            mail: {},
        };
    },
    async created() {
        const {id} = this.params;
        if (id) {
            await this.loadDetail(id);
        }
        this.invoiceParams = {invoiceId:id}
        this.materialFields = this.getMaterialFields();
        this.loaded = true;
    },
    methods: {
        async loadDetail(id) {
            this.invoiceData = await $.get({url: "/do/get/invoice", data: {id}});
            this.current = "detail"
            this.isNew = false;
        },
        beforeSubmitInvoice(formData) {
            for (const [key, value] of Object.entries(formData)) {
                this.invoice[key] = {value};
            }
            return {id: this.id, invoice: this.invoice};
        },
        beforeSubmitMail(formData) {
            for (const [key, value] of Object.entries(formData)) {
                this.mail[key] = {value};
            }
            return {id: this.id, mail: this.mail};
        },
        getMaterialFields() {
            return [
                { label: "物料", name: "materialId", type: 'material', multiple: false,params:{contractId:this.invoiceData.related},isContract: true },
                { label: "数量", name: "num", default: 1 },
                { label: "关联发票", name: "invoiceId", default: this.params.id, visible: false },
            ]
        },
    }

};
</script>
